import React from 'react';

export default class Blog extends React.Component{
  // constructor(props) {
  //   super(props);
  //   // console.log('props是'+JSON.stringify(this.props));
  // }

  trOnClickToToggle = (e) => {
    e.preventDefault();
    let source = this.props.item
    // let blog = this.props.item
    // blog.status = !blog.status
    this.props.trOnClickToToggle(source)
    // this.setState({
    //   status: !this.state.status
    // })

  }

  statusI18n() {
    return this.props.status ? '未完成' : '完成'
  }

  render() {
    // console.log('过来渲染的状态是'+this.props.status);
    // console.log("过来渲染的blogs是"+ JSON.stringify(this.props.blogs));
    if(this.props.status)
      return this.renderNormal()
    else
      return this.renderDel()
  }

  renderNormal() {
    return(
        <tr onClick={this.trOnClickToToggle} data-id={this.props.item.title} style={{'cursor': 'pointer' }} >
          <td>{this.props.item.title}</td>
          <td>{this.props.item.content}</td>
          <td>{this.props.item.created_at}</td>
          <td>{this.statusI18n()}</td>
        </tr>
    )
  }

  renderDel() {
    return(
      <tr onClick={this.trOnClickToToggle} style={{'cursor': 'pointer' }} >
        <td><del>{this.props.item.title}</del></td>
        <td><del>{this.props.item.content}</del></td>
        <td><del>{this.props.item.created_at}</del></td>
          <td><del>{this.statusI18n()}</del></td>
      </tr>
    )
  }

}
